<template>
	<div :class="{ editComponent: true, required: rowField.required }">
		<el-input v-model="rowData[rowField.fieldName]" clearable @blur="returnValue" :disabled="isDisabled"></el-input>
	</div>
</template>

<script>
import { getFunction } from '@/utils/ruoyi'

export default {
  name: "customInput",
  props:{
	rowField: {
		type: Object,
		default: () => {}
	},
	rowData: {
		type: Object,
		default: () => {}
	},
	rowIndex: {
		type: Number,
		default: 0
	},
	config: {
		type: Object,
		default: () => {}
	},
	bindValue: {
		default: ''
	}
  },
  data() {
    return {
		value: '',
		rowDataValue: this.rowData,
		tipsText: '',
		isTips: false,
    };
  },
  computed: {
	isDisabled() {
		if (this.rowField.oldDataFlag === 'Y' && this.rowData.id !== undefined) {
			return true
		} else {
			return false
		}
	}
  },
  mounted() {
	this.value = this.bindValue ? this.bindValue : this.rowField.defaultValue
  },
  methods: {
	// 执行自定义代码
    validCode(item, row, code) {
      const newFun = `function (item, row, that){${code}}`
      var performFun = getFunction(newFun);
      return performFun(item, row, this)
    },
	// 返回值
	returnValue() {
		if (this.rowField.jsCode && this.rowField.jsCode !== '' && this.rowField.jsMethod === 'blur') {
			if (!this.validCode(this.rowField, this.rowData, this.rowField.jsCode)) {
				return false
			} else {
				this.validCode(this.rowField, this.rowData, this.rowField.jsCode)
			}
		}
		// this.rowDataValue[this.rowField.fieldName] = this.value
		// this.$emit('blur', this.rowDataValue, this.rowIndex)
	}
  },
};
</script>

<style lang="scss" scoped>
	.editComponent ::v-deep .el-input--medium .el-input__inner {
		height: 32px;
		line-height: 32px;
	}
	.editComponent.required {
		position: relative;
	}
	.editComponent.required::after {
		content: "*";
		position: absolute;
		top: 0;
		left: -9px;
		color: red;
		line-height: 1.2
	}
</style>
